document.addEventListener('DOMContentLoaded', function() {
    // 获取最新天气数据
    fetch('/api/weather/latest')
        .then(response => response.json())
        .then(data => {
            if (data.status === 'success') {
                createCharts(data.data);
            }
        })
        .catch(error => console.error('Error:', error));
});

function createCharts(data) {
    // 准备数据
    const cities = [...new Set(data.map(item => item.location))];
    const temperatures = cities.map(city => {
        const cityData = data.find(item => item.location === city);
        return cityData ? cityData.temperature : 0;
    });
    const humidities = cities.map(city => {
        const cityData = data.find(item => item.location === city);
        return cityData ? cityData.humidity : 0;
    });

    // 温度对比图
    new Chart(document.getElementById('temperatureChart'), {
        type: 'bar',
        data: {
            labels: cities,
            datasets: [{
                label: '温度 (°C)',
                data: temperatures,
                backgroundColor: 'rgba(255, 99, 132, 0.5)',
                borderColor: 'rgba(255, 99, 132, 1)',
                borderWidth: 1
            }]
        },
        options: {
            responsive: true,
            scales: {
                y: {
                    beginAtZero: true,
                    title: {
                        display: true,
                        text: '温度 (°C)'
                    }
                }
            }
        }
    });

    // 湿度对比图
    new Chart(document.getElementById('humidityChart'), {
        type: 'bar',
        data: {
            labels: cities,
            datasets: [{
                label: '湿度 (%)',
                data: humidities,
                backgroundColor: 'rgba(54, 162, 235, 0.5)',
                borderColor: 'rgba(54, 162, 235, 1)',
                borderWidth: 1
            }]
        },
        options: {
            responsive: true,
            scales: {
                y: {
                    beginAtZero: true,
                    title: {
                        display: true,
                        text: '湿度 (%)'
                    }
                }
            }
        }
    });

    // 城市天气综合对比
    new Chart(document.getElementById('cityComparisonChart'), {
        type: 'radar',
        data: {
            labels: ['温度', '湿度', '风速', '气压'],
            datasets: cities.map((city, index) => {
                const cityData = data.find(item => item.location === city);
                const colors = [
                    'rgba(255, 99, 132, 0.5)',
                    'rgba(54, 162, 235, 0.5)',
                    'rgba(255, 206, 86, 0.5)',
                    'rgba(75, 192, 192, 0.5)'
                ];
                return {
                    label: city,
                    data: [
                        cityData.temperature,
                        cityData.humidity,
                        cityData.wind_speed,
                        cityData.pressure / 10  // 缩放气压值以适应图表
                    ],
                    backgroundColor: colors[index],
                    borderColor: colors[index].replace('0.5', '1'),
                    borderWidth: 1
                };
            })
        },
        options: {
            responsive: true,
            scales: {
                r: {
                    beginAtZero: true
                }
            }
        }
    });
}